import Modal from 'components/Modal'
import Dialog from "components/Dialog";
import Button from 'components/Button'
import {useState} from "react";

export default function ModalDemo() {
  const [show, setShow] = useState(false)
  const [dshow, setDshow] = useState(false)

  return (
    <div>
      <Button type="primary" onClick={() => setShow(true)}>显示弹窗</Button>
      <Modal show={show} onClose={() => setShow(false)} />
      <Button type="primary" onClick={() => setDshow(true)}>显示Dialog</Button>
      <div style={{ height: '300px' }}>space</div>
      <div style={{ height: '300px' }}>space</div>
      <div style={{ height: '300px' }}>space</div>
      <div style={{ height: '300px' }}>space</div>
      <div style={{ height: '300px' }}>space</div>
      <div style={{ height: '300px' }}>space</div>
      <div style={{textAlign: 'end'}}><Button type="primary" onClick={() => setDshow(true)}>显示Dialog</Button></div>
      <Dialog title="提示" show={dshow} onClose={() => setDshow(false)} onSure={() => setDshow(false)}>
        content of the dialog
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
        <div>收到了福克斯老地方开讲啦收到了福克斯老地方开讲啦</div>
      </Dialog>
    </div>
  )
}